---
import { Observed, Section, SectionHeadline } from "#components/fragments";
import { FeaturesCarousel } from "./features-carousel";
---

<Section>
  <SectionHeadline
    title="Headless & open-source"
    subtitle="Manage and publish your content - your way."
  />
  <div class="flex flex-col w-full justify-center items-center gap-8">
    <Observed
      class="transition-opacity delay-250 duration-500 ease-out"
      outOfViewClass="opacity-0"
      client:visible
    >
      <FeaturesCarousel client:load />
    </Observed>
  </div>
</Section>
